import React, { Component } from 'react'
import { Layout } from 'antd';
import { Menu, Button } from 'antd';
import RouterView from '../router/routerView';
import routerList from '../router/routerList';
import { Route, Switch, NavLink } from 'react-router-dom'
import {
    AppstoreOutlined,
    MenuUnfoldOutlined,
    MenuFoldOutlined,
    PieChartOutlined,
    DesktopOutlined,
    ContainerOutlined,
    MailOutlined,
} from '@ant-design/icons';
const { Header, Footer, Sider, Content } = Layout;
function getItem(label, key, icon, children, type) {
    return {
      key,
      icon,
      children,
      label,
      type,
    };
}
const items = [
    getItem( <NavLink to="/dh1">导航1</NavLink>, '1', <PieChartOutlined />),
    getItem( <NavLink to="/dh2">导航2</NavLink>, '2', <DesktopOutlined />),
    getItem('Navigation One', 'sub1', <MailOutlined />, [
      getItem('Option 5', '5'),
      getItem('Option 6', '6'),
    ]),
  ];
class App extends Component {
    state = {
        collapsed:"true"
    }
    render() {
        return (
            
            <div className='appwrap'>
               
                <Layout>
                    <Header>Header</Header>
                    <Layout>
                        <Sider>
                            <div
                                style={{
                                    width: 200,
                                }}
                            >
                
                                <Menu
                                    defaultSelectedKeys={['1']}
                                    defaultOpenKeys={['sub1']}
                                    mode="inline"
                                    theme="dark"
                                    collapsed={this.state.collapsed}
                                    items={items}
                                />
                            </div>





                        </Sider>
                        <Content>
                                <RouterView RouterList={routerList}></RouterView>
                                {/* <Switch>
                                    <Route path="/dh1" component={Router01}></Route>
                                    <Route path="/dh2" component={Router02}></Route>
                                </Switch> */}
                        </Content>
                    </Layout>
                </Layout>
            </div>
        )
    }
}

export default App